<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link type="text/css" rel="stylesheet" href="../static/css/common.min.css">
    <link type="text/css" rel="stylesheet" href="../static/css/cheer.min.css">
    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
    <script src="../static/js/jquery-1.12.3.min.js"></script>
    <script src="../static/js/flexible.min.js"></script>
    <script src="../static/js/common.min.js"></script>
    <script src="../static/js/cheer.min.js"></script>
    <script>
        //获取剩余天数
        let getDayAjax = () => {
            $.ajax({
                url: "test.json",//后端链接
                type: "post",
                data: {},
                dataType: "json",
                success: function(data){
                    setDay(data.day);//执行插入天数,传入天数
                    console.log(data);//可修改，success处理
                },
                error: function(data){
                    console.log(data);
                }
            });
        }
        //获取视频链接
        let getVideoAjax = () => {
            $.ajax({
                url: "test.json",//后端链接
                type: "post",
                data: {},
                dataType: "json",
                success: function(data){
                    setVideo(data.src);//执行插入视频链接,传入视频链接
                    console.log(data);//可修改，success处理
                },
                error: function(data){
                    console.log(data);
                }
            });
        }
        //获取点赞数
        let getFavorAjax = () => {
            $.ajax({
                url: "test.json",//后端链接
                type: "post",
                data: {},
                dataType: "json",
                success: function(data){
                    setFavor(data.favor);//执行插入点赞数,传入点赞数
                    console.log(data);//可修改，success处理
                },
                error: function(data){
                    console.log(data);
                }
            });
        }
        //微信朋友圈分享，参考https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115
        // wx.config({
        //     debug: false,
        //     appId: '@appId',
        //     timestamp: '@timestamp',
        //     nonceStr: '@noncestr',
        //     signature: '@signature',
        //     jsApiList: ['updateTimelineShareData']
        // });
        // wx.ready(function () {//需在用户可能点击分享按钮前就先调用
        //     wx.updateTimelineShareData({ 
        //         title: '', // 分享标题
        //         link: '', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
        //         imgUrl: '', // 分享图标
        //         success: function () {
        //             // 设置成功
        //         }
        //     });
        // });
        $(function(){
            //显示新手教程
            //隐藏新手教程
            //hideCheerGuide();
            $(".invitation").on("click",function(){
                //微信朋友圈分享
                console.log("微信朋友圈分享");
                showCheerGuide();
            });
            //获取用户信息
            $.ajax({
                url: "test.json",//后端链接
                type: "post",
                data: {},
                dataType: "json",
                success: function(data){
                    $('.user-head').html('<img src="'+data.url+'" /><p>'+data.name+'</p>')
                },
                error: function(data){
                    console.log(data);
                }
            });
        });
    </script>
    <title>51Talk之星 中华少年说</title>
</head>
<body>
    <div class="cheer-container">
        <div class="header">
            <div class="time">
                <img class="time-img" src="../static/images/cheer/cheerTime.png" />
                <div class="time-box">
                    <p class="time-word">86</p>
                </div>
            </div>
            <div class="rule">
                <img class="rule-img" src="../static/images/activityRule.png" />
            </div>
        </div>
        <div class="title">
            <div class="title-box">
                <p class="title-word">我是第 <span class="title-word-number">6839230</span> 位</p>
                <p class="title-word2">加入非遗文化保护的小使者!</p>
            </div>
        </div>
        <div class="content">
            <img class="content-play" src="../static/images/cheer/play.png" />
            <img class="poster-img" src="../static/images/cheer/poster.png" />
            <video class="content-video" src="http://demo.lanrenzhijia.com/demo/51/5183/demo/vedio/sintel.mp4" poster="../static/images/cheer/poster.png" playsinline controls="false" x5-playsinline="" playsinline="" webkit-playsinline=""></video>
            <div class="user-head">
                <img src="../static/images/cheer/head.png" />
                <p>51Talk 恭喜您</p>
            </div>
            <div class="content-box">
                <p class="content-number">686</p>
            </div>
            <a class="content-cheer" href="#">助威规则 &gt;</a>
        </div>
        <div class="invitation">
            
        </div>
    </div>
    <iframe id="rule" name="rule" src="rule.html"></iframe>
    <iframe id="cheer-guide" name="cheer-guide" src="cheerGuide.html"></iframe>
    <iframe id="cheerRule" name="cheerRule" src="cheerRule.html"></iframe>
</body>
</html>